<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			/*
			当使用line-height: 150%;时，还h3和p会有部分重叠，而当使用 line-height: 1.5;时，就不会有任何问题
			原因：当使用line-height: 150%;时，h3和p继承的并不是150%或1.5em，而是经过150%*14计算后的值21px。也就是说
			h3和p的行高都是21px，考虑到h3的font-size大小为32px，所以此时h3的半行间距就是-5.5px，所以会和p发生重叠
			而当使用 line-height: 1.5;时，h3和p继承的就是1.5，此时，对于h3来说，行高就是1.5*32=48px,p的行高就是1.5*20=30px
			*/
			body{
				font-size: 14px;
				/* line-height: 1.5; */
				line-height: 150%;
			}
			h3,p{
				margin: 0;
			}
			h3{
				font-size: 32px;
			}
			p{
				font-size: 20px;
			}
		</style>
	</head>
	<body>
		<h3>标签</h3>
		<p>内容</p>
	</body>
</html>
